<!DOCTYPE html>
<!--suppress ALL -->
<html lang="zh-cn">
<head>
    {{template "header" .}}
    <link href="{{.Dir}}/static/easyUI/themes/bootstrap/easyui.css" rel="stylesheet" type="text/css">
    <link href="{{.Dir}}/static/easyUI/themes/icon.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="{{.Dir}}/static/kindeditor/themes/default/default.css"/>
    <script charset="utf-8" src="{{.Dir}}/static/kindeditor/kindeditor-min.js"></script>
    <script charset="utf-8" src="{{.Dir}}/static/kindeditor/lang/zh_CN.js"></script>
    <title>FrankZhang的博客空间</title>
</head>
<body>
<noscript>请启用您浏览器的 JavaScript 选项！</noscript>
{{template "nav" .}}
<div class="container" style="margin-bottom: 30px">
    <h1>添加文章</h1>

    <form id="addTopic">
        <div class="form-group">
            <label for="title">Title</label>
            <input type="text" class="form-control" id="title" name="Title" placeholder="Title">
        </div>
        <div class="form-group">
            <label for="category">Category</label>
            <input type="text" class="form-control" id="category" name="Category" placeholder="category">
        </div>
        <div class="form-group">
            <label for="lables">Lables</label>
            <input type="text" class="form-control" id="lables" name="Lables" placeholder="lables">
        </div>
        <textarea name="Content" style="width:800px;height:400px;visibility:hidden;"></textarea>

        <button type="button" class="btn btn-default" onclick="return addTopic()">Submit</button>
    </form>
</div>

<div class="container">
    <div id="grid" style="width: 100%;"></div>
    <div id="pagination" style="background:#efefef;width: 100%;margin-top: 0"></div>
</div>
</body>
{{template "js" .}}
<script src="{{.Dir}}/static/easyUI/jquery.easyui.min.js"></script>
<script>
    var editor;
    KindEditor.ready(function (K) {
        editor = K.create('textarea[name="Content"]', {
            allowImageUpload: true,
            uploadJson: '/uploadFile'
        });

        K('input[name=getText]').click(function (e) {
            $('#text').val(editor.html())
        });
    });

    function addTopic() {
        $.ajax({
            url: "topic",
            method: "post",
            data: {
                Title: $('#title').val(),
                Category: $('#category').val(),
                Lables: $('#lables').val(),
                Content: editor.html()
            },
            success: function (data) {
                $('#pagination').pagination('select');
                $('#addTopic').form('clear')
                editor.html('');
            }
        })
    }

    //查看
    function showTopic(index) {
        var row = $('#grid').datagrid('getData').rows[index];
        BootstrapDialog.show({
            title: row.Title,
            message: row.Content
        })
    }

    //修改状态
    function ModifyStatusTopic(Id) {
        $.ajax({
            url: "topic/mstatus",
            method: "post",
            data: {
                Id: Id
            },
            success: function (data) {
                $('#pagination').pagination('select');
            }
        })
    }

    $(document).ready(function () {

        //构造datagrid
        $('#grid').datagrid({
            height: 527,
            singleSelect: true,
            fitColumns: true,
            columns: [[
                {field: 'Id', title: 'Id', width: 50},
                {field: 'Title', title: 'Title', width: 80},
                {field: 'Category', title: 'Category', width: 100, align: 'left'},
//                {field: 'Content', title: 'Content', width: 150, align: 'left'},
                {
                    field: 'Created', title: 'Created', width: 100, align: 'left',
                    formatter: function (value, row, index) {
                        if (row.Created == null) return "非法创建";
                        var date2 = new Date(row.Created);
                        return date2.Format("yyyy-MM-dd HH:mm:ss");
                    }
                },
                {field: 'Views', title: 'Views', width: 100, align: 'left'},
                {
                    field: 'TopicTime', title: 'TopicTime', width: 100, align: 'left',
                    formatter: function (value, row, index) {
                        if (row.TopicTime == null) return "";
                        var date2 = new Date(row.TopicTime);
                        return date2.Format("yyyy-MM-dd HH:mm:ss");
                    }
                },
                {field: 'TopicCount', title: 'TopicCount', width: 100, align: 'left'},
                {field: 'TopicLastUserId', title: 'TopicLastUserId', width: 100, align: 'left'},
                {
                    field: 'opt', title: '操作', width: 100, align: 'center',
                    formatter: function (value, row, index) {
                        var s = '<button onclick="showTopic(\'' + index + '\')">查看</button> ';
                        var e = '<button onclick="edit(\'' + row.xsbh + '\')">编辑</button> ';
                        var d = '<button onclick="ModifyStatusTopic(\'' + row.Id + '\')">删除</button> ';
                        if (row.DeleteFlag == 1) {
                            d = d.replace("删除", "恢复");
                        }
                        return s + e + d;
                    }
                }
            ]]
        });

        //构造分页
        $('#pagination').pagination({
            total: 5000,
            pageSize: 20,
            displayMsg: "",
            beforePageText: "",
            afterPageText: "",
            showPageList: true,
            showRefresh: true,
            onSelectPage: function (pageNumber, pageSize) {
                $(this).pagination('loading');
                $.get("topic/all", {page: pageNumber, rows: pageSize}, function (data) {
                    $('#grid').datagrid('loadData', data);
                });
                $(this).pagination('loaded');
            }
        });
        $('#pagination').pagination('select');
    });


</script>
</html>